<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="A fully featured admin theme which can be used to build CRM, CMS, etc.">
        <meta name="author" content="Coderthemes">

        <link rel="shortcut icon" href="__STATIC__/assets/images/favicon.ico">
        
        <title>Adminto - Responsive Admin Dashboard Template</title>

        <!--Morris Chart CSS -->
        <link rel="stylesheet" href="__STATIC__/assets/plugins/morris/morris.css">

        <!-- App css -->
        <!-- <link href="__STATIC__/assets/css/bootstrap.min.css" rel="stylesheet" type="text/css" /> -->
        <!-- <link href="__STATIC__/assets/css/icons.css" rel="stylesheet" type="text/css" /> -->
        <!-- <link href="__STATIC__/assets/css/style.css" rel="stylesheet" type="text/css" /> -->

        <!-- <script src="__STATIC__/assets/js/modernizr.min.js"></script> -->
        <link href="__STATIC__/assets/plugins/bootstrap-tagsinput/dist/bootstrap-tagsinput.css" rel="stylesheet" />
        <link href="__STATIC__/assets/plugins/multiselect/css/multi-select.css"  rel="stylesheet" type="text/css" />
        <link href="__STATIC__/assets/plugins/select2/dist/css/select2.css" rel="stylesheet" type="text/css">
        <link href="__STATIC__/assets/plugins/select2/dist/css/select2-bootstrap.css" rel="stylesheet" type="text/css">
        <link href="__STATIC__/assets/plugins/bootstrap-touchspin/dist/jquery.bootstrap-touchspin.min.css" rel="stylesheet" />
        <link href="__STATIC__/assets/plugins/switchery/switchery.min.css" rel="stylesheet" />
        <link href="__STATIC__/assets/plugins/timepicker/bootstrap-timepicker.min.css" rel="stylesheet">
        <link href="__STATIC__/assets/plugins/mjolnic-bootstrap-colorpicker/dist/css/bootstrap-colorpicker.min.css" rel="stylesheet">
        <link href="__STATIC__/assets/plugins/bootstrap-datepicker/dist/css/bootstrap-datepicker.min.css" rel="stylesheet">
        <link href="__STATIC__/assets/plugins/bootstrap-daterangepicker/daterangepicker.css" rel="stylesheet">

        <!-- App css -->
        <link href="__STATIC__/assets/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
        <link href="__STATIC__/assets/css/icons.css" rel="stylesheet" type="text/css" />
        <link href="__STATIC__/assets/css/style.css" rel="stylesheet" type="text/css" />
        <!-- form Uploads -->
        <link href="__STATIC__/assets/plugins/fileuploads/css/dropify.min.css" rel="stylesheet" type="text/css" />

        <!-- App css -->
        <!-- <link href="assets/css/bootstrap.min.css" rel="stylesheet" type="text/css" /> -->
        <!-- <link href="assets/css/icons.css" rel="stylesheet" type="text/css" /> -->
        <!-- <link href="assets/css/style.css" rel="stylesheet" type="text/css" /> -->

        <!-- <script src="assets/js/modernizr.min.js"></script> -->
        <script src="__STATIC__/assets/js/modernizr.min.js"></script>

    </head>


    <body class="fixed-left">

        <!-- Begin page -->
        <div id="wrapper">

            <!-- Top Bar Start -->
            <div class="topbar">

                <!-- LOGO -->
                <div class="topbar-left">
                    <a href="{:url('Index/index')}" class="logo"><span>do,re,<span>mi</span></span><i class="mdi mdi-layers"></i></a>
                </div>

                <!-- Button mobile view to collapse sidebar menu -->
                <div class="navbar navbar-default" role="navigation">
                    <div class="container-fluid">

                        <!-- Page title -->
                        <ul class="nav navbar-nav list-inline navbar-left">
                            <li class="list-inline-item">
                                <button class="button-menu-mobile open-left">
                                    <i class="mdi mdi-menu"></i>
                                </button>
                            </li>
                            <li class="list-inline-item">
                                <h4 class="page-title">商品入库 :</h4>
                            </li>
                        </ul>

                        <nav class="navbar-custom">

                            <ul class="list-unstyled topbar-right-menu float-right mb-0">

                                <li>
                                    <!-- Notification -->
                                    <div class="notification-box">
                                        <ul class="list-inline mb-0">
                                            <li>
                                                <a href="javascript:void(0);" class="right-bar-toggle">
                                                    <i class="mdi mdi-bell-outline noti-icon"></i>
                                                </a>
                                                <div class="noti-dot">
                                                    <span class="dot"></span>
                                                    <span class="pulse"></span>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                    <!-- End Notification bar -->
                                </li>

                                <li class="hide-phone">
                                    <form class="app-search">
                                        <input type="text" placeholder="Search..."
                                               class="form-control">
                                        <button type="submit"><i class="fa fa-search"></i></button>
                                    </form>
                                </li>

                            </ul>
                        </nav>
                    </div><!-- end container -->
                </div><!-- end navbar -->
            </div>
            <!-- Top Bar End -->


            <!-- ========== Left Sidebar Start ========== -->
            {include file="public/left"}
            <!-- Left Sidebar End -->



            <!-- ============================================================== -->
            <!-- Start right Content here -->
            <!-- ============================================================== -->
            <div class="content-page">
                <!-- Start content -->
                <div class="content">
                    <div class="container-fluid">
                        <div class="row">
                            <div class="col-12">
                                <div class="p-20">
                                    <form class="form-horizontal" role="form" action="{:url('Commodity/add')}" enctype="multipart/form-data" method="post">
                                        <div class="form-group row">
                                            <label class="col-2 col-form-label">商品父类 :</label>
                                            <div class="col-10">
                                                <select class="form-control" name="pid">
                                                    <option value="0">如果不选择，当前商品则为父级...</option>
                                                    {volist name="list" id="vo"}
                                                        <option value="{$vo.id}">{$vo.name}</option>
                                                    {/volist}
                                                    <!-- <option>4</option>
                                                    <option>5</option> -->
                                                </select>
                                                
                                            </div>
                                        </div>
                                        <div class="form-group row">
                                            <label class="col-2 col-form-label">商品名称 :</label>
                                            <div class="col-10">
                                                <input type="text" name="name" class="form-control" placeholder="请输入商品名称....">
                                            </div>
                                        </div>
                                        <div class="form-group row">
                                            <label class="col-2 col-form-label">商品单位 :</label>
                                            <div class="col-10">
                                                <input type="text" name="com" class="form-control" placeholder="请输入商品单位 如: 个/袋/件....">
                                            </div>
                                        </div>
                                        <div class="form-group row">
                                            <label class="col-2 col-form-label">商品数量 :</label>
                                            <div class="col-10">
                                                <input id="demo3" type="text"  value="" name="demo3">
                                            </div>
                                        </div>
                                        
                                        <div class="form-group row">
                                            <label class="col-2 col-form-label">商品图片 :</label>
                                            <div class="col-10">
                                                <input type="file" class="dropify" name="img" data-height="150" />
                                            </div>
                                        </div>
                    
                                        <!-- <div class="form-group row">
                                            <label class="col-2 col-form-label">商品价格 :</label>
                                            <div class="col-10">
                                                <input type="text" name="unit" class="form-control" placeholder="请输入商品单价....">
                                            </div>
                                        </div> -->
                                        

                                        
                                        
                                        <div class="form-group row">
                                            <label class="col-2 col-form-label">商品简介 :</label>
                                            <div class="col-10">
                                                <textarea class="form-control" name="content" rows="5" placeholder="请输入商品简介...."></textarea>
                                            </div>
                                        </div>
                                        <br>
                                        <div class="form-group row">
                                            <div class="col-10">
                                                <button class="btn btn-primary btn-rounded w-md waves-effect waves-light m-b-5" style="margin-left: 55%;width:200px;">确认入库</button>
                                            </div>
                                        </div>
                                        
                                    </form>
                                </div>
                            </div>

                        </div>
                        <!-- end row -->
                    </div> <!-- container -->

                </div> <!-- content -->

                <footer class="footer text-right">
                    2016 - 2018 © Adminto. Coderthemes.com
                </footer>

            </div>


            <!-- ============================================================== -->
            <!-- End Right content here -->
            <!-- ============================================================== -->


            <!-- Right Sidebar -->
            
            <!-- /Right-bar -->

        </div>
        <!-- END wrapper -->


        <!-- jQuery  -->
        <script src="__STATIC__/assets/js/jquery.min.js"></script>
        <script src="__STATIC__/assets/js/popper.min.js"></script>
        <script src="__STATIC__/assets/js/bootstrap.min.js"></script>
        <script src="__STATIC__/assets/js/detect.js"></script>
        <script src="__STATIC__/assets/js/fastclick.js"></script>
        <script src="__STATIC__/assets/js/jquery.blockUI.js"></script>
        <script src="__STATIC__/assets/js/waves.js"></script>
        <script src="__STATIC__/assets/js/jquery.nicescroll.js"></script>
        <script src="__STATIC__/assets/js/jquery.slimscroll.js"></script>
        <script src="__STATIC__/assets/js/jquery.scrollTo.min.js"></script>

        <!-- KNOB JS -->
        <!--[if IE]>
        <script type="text/javascript" src="__STATIC__/assets/plugins/jquery-knob/excanvas.js"></script>
        <![endif]-->
        <script src="__STATIC__/assets/plugins/jquery-knob/jquery.knob.js"></script>

        <!--Morris Chart-->
        <script src="__STATIC__/assets/plugins/morris/morris.min.js"></script>
        <script src="__STATIC__/assets/plugins/raphael/raphael-min.js"></script>

        <!-- Dashboard init -->
        <script src="__STATIC__/assets/pages/jquery.dashboard.js"></script>

        <!-- App js -->
        <script src="__STATIC__/assets/js/jquery.core.js"></script>
        <script src="__STATIC__/assets/js/jquery.app.js"></script>

        <!-- jQuery  -->
        <!-- <script src="__STATIC__/assets/js/jquery.min.js"></script> -->
        <!-- <script src="__STATIC__/assets/js/popper.min.js"></script> -->
        <!-- <script src="__STATIC__/assets/js/bootstrap.min.js"></script> -->
        <!-- <script src="__STATIC__/assets/js/detect.js"></script> -->
        <!-- <script src="__STATIC__/assets/js/fastclick.js"></script> -->
        <!-- <script src="__STATIC__/assets/js/jquery.blockUI.js"></script> -->
        <!-- <script src="__STATIC__/assets/js/waves.js"></script> -->
        <!-- <script src="__STATIC__/assets/js/jquery.nicescroll.js"></script> -->
        <!-- <script src="__STATIC__/assets/js/jquery.slimscroll.js"></script> -->
        <!-- <script src="__STATIC__/assets/js/jquery.scrollTo.min.js"></script> -->

        <!-- Plugins Js -->
        <script src="__STATIC__/assets/plugins/switchery/switchery.min.js"></script>
        <script src="__STATIC__/assets/plugins/bootstrap-tagsinput/dist/bootstrap-tagsinput.min.js"></script>
        <script type="text/javascript" src="__STATIC__/assets/plugins/multiselect/js/jquery.multi-select.js"></script>
        <script type="text/javascript" src="__STATIC__/assets/plugins/jquery-quicksearch/jquery.quicksearch.js"></script>
        <script src="__STATIC__/assets/plugins/select2/dist/js/select2.min.js" type="text/javascript"></script>
        <script src="__STATIC__/assets/plugins/bootstrap-touchspin/dist/jquery.bootstrap-touchspin.min.js" type="text/javascript"></script>
        <script src="__STATIC__/assets/plugins/bootstrap-inputmask/bootstrap-inputmask.min.js" type="text/javascript"></script>
        <script src="__STATIC__/assets/plugins/moment/moment.js"></script>
        <script src="__STATIC__/assets/plugins/timepicker/bootstrap-timepicker.min.js"></script>
        <script src="__STATIC__/assets/plugins/mjolnic-bootstrap-colorpicker/dist/js/bootstrap-colorpicker.min.js"></script>
        <script src="__STATIC__/assets/plugins/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js"></script>
        <script src="__STATIC__/assets/plugins/bootstrap-daterangepicker/daterangepicker.js"></script>
        <script src="__STATIC__/assets/plugins/bootstrap-maxlength/bootstrap-maxlength.min.js" type="text/javascript"></script>

        <!-- App js -->
        <!-- <script src="__STATIC__/assets/js/jquery.core.js"></script> -->
        <!-- <script src="__STATIC__/assets/js/jquery.app.js"></script> -->
        <!-- <script src="assets/js/jquery.min.js"></script> -->
        <!-- <script src="assets/js/popper.min.js"></script> -->
        <!-- <script src="assets/js/bootstrap.min.js"></script> -->
        <!-- <script src="assets/js/detect.js"></script> -->
        <!-- <script src="assets/js/fastclick.js"></script> -->
        <!-- <script src="assets/js/jquery.blockUI.js"></script> -->
        <!-- <script src="assets/js/waves.js"></script> -->
        <!-- <script src="assets/js/jquery.nicescroll.js"></script> -->
        <!-- <script src="assets/js/jquery.slimscroll.js"></script> -->
        <!-- <script src="assets/js/jquery.scrollTo.min.js"></script> -->

        <!-- file uploads js -->
        <script src="__STATIC__/assets/plugins/fileuploads/js/dropify.min.js"></script>

        <!-- App js -->
        <!-- <script src="assets/js/jquery.core.js"></script> -->
        <!-- <script src="assets/js/jquery.app.js"></script> -->
        <script>
            jQuery(document).ready(function() {

                //advance multiselect start
                $('#my_multi_select3').multiSelect({
                    selectableHeader: "<input type='text' class='form-control search-input' autocomplete='off' placeholder='search...'>",
                    selectionHeader: "<input type='text' class='form-control search-input' autocomplete='off' placeholder='search...'>",
                    afterInit: function (ms) {
                        var that = this,
                                $selectableSearch = that.$selectableUl.prev(),
                                $selectionSearch = that.$selectionUl.prev(),
                                selectableSearchString = '#' + that.$container.attr('id') + ' .ms-elem-selectable:not(.ms-selected)',
                                selectionSearchString = '#' + that.$container.attr('id') + ' .ms-elem-selection.ms-selected';

                        that.qs1 = $selectableSearch.quicksearch(selectableSearchString)
                                .on('keydown', function (e) {
                                    if (e.which === 40) {
                                        that.$selectableUl.focus();
                                        return false;
                                    }
                                });

                        that.qs2 = $selectionSearch.quicksearch(selectionSearchString)
                                .on('keydown', function (e) {
                                    if (e.which == 40) {
                                        that.$selectionUl.focus();
                                        return false;
                                    }
                                });
                    },
                    afterSelect: function () {
                        this.qs1.cache();
                        this.qs2.cache();
                    },
                    afterDeselect: function () {
                        this.qs1.cache();
                        this.qs2.cache();
                    }
                });

                // Select2
                $(".select2").select2();

                $(".select2-limiting").select2({
                    maximumSelectionLength: 2
                });

            });

            //Bootstrap-TouchSpin
            $(".vertical-spin").TouchSpin({
                verticalbuttons: true,
                buttondown_class: "btn btn-primary",
                buttonup_class: "btn btn-primary",
                verticalupclass: 'ti-plus',
                verticaldownclass: 'ti-minus'
            });
            var vspinTrue = $(".vertical-spin").TouchSpin({
                verticalbuttons: true
            });
            if (vspinTrue) {
                $('.vertical-spin').prev('.bootstrap-touchspin-prefix').remove();
            }

            $("input[name='demo1']").TouchSpin({
                min: 0,
                max: 100,
                step: 0.1,
                decimals: 2,
                boostat: 5,
                maxboostedstep: 10,
                buttondown_class: "btn btn-primary",
                buttonup_class: "btn btn-primary",
                postfix: '%'
            });
            $("input[name='demo2']").TouchSpin({
                min: -1000000000,
                max: 1000000000,
                stepinterval: 50,
                buttondown_class: "btn btn-primary",
                buttonup_class: "btn btn-primary",
                maxboostedstep: 10000000,
                prefix: '$'
            });
            $("input[name='demo3']").TouchSpin({
                buttondown_class: "btn btn-primary",
                buttonup_class: "btn btn-primary"
            });
            $("input[name='demo3_21']").TouchSpin({
                initval: 40,
                buttondown_class: "btn btn-primary",
                buttonup_class: "btn btn-primary"
            });
            $("input[name='demo3_22']").TouchSpin({
                initval: 40,
                buttondown_class: "btn btn-primary",
                buttonup_class: "btn btn-primary"
            });

            $("input[name='demo5']").TouchSpin({
                prefix: "pre",
                postfix: "post",
                buttondown_class: "btn btn-primary",
                buttonup_class: "btn btn-primary"
            });
            $("input[name='demo0']").TouchSpin({
                buttondown_class: "btn btn-primary",
                buttonup_class: "btn btn-primary"
            });

            // Time Picker
            jQuery('#timepicker').timepicker({
                defaultTIme : false,
                icons: {
                    up: 'mdi mdi-chevron-up',
                    down: 'mdi mdi-chevron-down'
                }
            });
            jQuery('#timepicker2').timepicker({
                showMeridian : false,
                icons: {
                    up: 'mdi mdi-chevron-up',
                    down: 'mdi mdi-chevron-down'
                }
            });
            jQuery('#timepicker3').timepicker({
                minuteStep : 15,
                icons: {
                    up: 'mdi mdi-chevron-up',
                    down: 'mdi mdi-chevron-down'
                }
            });

            //colorpicker start

            $('.colorpicker-default').colorpicker({
                format: 'hex'
            });
            $('.colorpicker-rgba').colorpicker();

            // Date Picker
            jQuery('#datepicker').datepicker();
            jQuery('#datepicker-autoclose').datepicker({
                autoclose: true,
                todayHighlight: true
            });
            jQuery('#datepicker-inline').datepicker();
            jQuery('#datepicker-multiple-date').datepicker({
                format: "mm/dd/yyyy",
                clearBtn: true,
                multidate: true,
                multidateSeparator: ","
            });
            jQuery('#date-range').datepicker({
                toggleActive: true
            });

            //Date range picker
            $('.input-daterange-datepicker').daterangepicker({
                buttonClasses: ['btn', 'btn-sm'],
                applyClass: 'btn-secondary',
                cancelClass: 'btn-primary'
            });
            $('.input-daterange-timepicker').daterangepicker({
                timePicker: true,
                format: 'MM/DD/YYYY h:mm A',
                timePickerIncrement: 30,
                timePicker12Hour: true,
                timePickerSeconds: false,
                buttonClasses: ['btn', 'btn-sm'],
                applyClass: 'btn-secondary',
                cancelClass: 'btn-primary'
            });
            $('.input-limit-datepicker').daterangepicker({
                format: 'MM/DD/YYYY',
                minDate: '06/01/2016',
                maxDate: '06/30/2016',
                buttonClasses: ['btn', 'btn-sm'],
                applyClass: 'btn-secondary',
                cancelClass: 'btn-primary',
                dateLimit: {
                    days: 6
                }
            });

            $('#reportrange span').html(moment().subtract(29, 'days').format('MMMM D, YYYY') + ' - ' + moment().format('MMMM D, YYYY'));

            $('#reportrange').daterangepicker({
                format: 'MM/DD/YYYY',
                startDate: moment().subtract(29, 'days'),
                endDate: moment(),
                minDate: '01/01/2016',
                maxDate: '12/31/2016',
                dateLimit: {
                    days: 60
                },
                showDropdowns: true,
                showWeekNumbers: true,
                timePicker: false,
                timePickerIncrement: 1,
                timePicker12Hour: true,
                ranges: {
                    'Today': [moment(), moment()],
                    'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
                    'Last 7 Days': [moment().subtract(6, 'days'), moment()],
                    'Last 30 Days': [moment().subtract(29, 'days'), moment()],
                    'This Month': [moment().startOf('month'), moment().endOf('month')],
                    'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
                },
                opens: 'left',
                drops: 'down',
                buttonClasses: ['btn', 'btn-sm'],
                applyClass: 'btn-success',
                cancelClass: 'btn-secondary',
                separator: ' to ',
                locale: {
                    applyLabel: 'Submit',
                    cancelLabel: 'Cancel',
                    fromLabel: 'From',
                    toLabel: 'To',
                    customRangeLabel: 'Custom',
                    daysOfWeek: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
                    monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
                    firstDay: 1
                }
            }, function (start, end, label) {
                console.log(start.toISOString(), end.toISOString(), label);
                $('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
            });

            //Bootstrap-MaxLength
            $('input#defaultconfig').maxlength({
                warningClass: "badge badge-success",
                limitReachedClass: "badge badge-danger"
            });

            $('input#thresholdconfig').maxlength({
                threshold: 20,
                warningClass: "badge badge-success",
                limitReachedClass: "badge badge-danger"
            });

            $('input#moreoptions').maxlength({
                alwaysShow: true,
                warningClass: "badge badge-success",
                limitReachedClass: "badge badge-danger"
            });

            $('input#alloptions').maxlength({
                alwaysShow: true,
                warningClass: "badge badge-success",
                limitReachedClass: "badge badge-danger",
                separator: ' out of ',
                preText: 'You typed ',
                postText: ' chars available.',
                validate: true
            });

            $('textarea#textarea').maxlength({
                alwaysShow: true,
                warningClass: "badge badge-success",
                limitReachedClass: "badge badge-danger"
            });

            $('input#placement').maxlength({
                alwaysShow: true,
                placement: 'top-left',
                warningClass: "badge badge-success",
                limitReachedClass: "badge badge-danger"
            });

            $('.dropify').dropify({
                messages: {
                    'default': 'Drag and drop a file here or click',
                    'replace': 'Drag and drop or click to replace',
                    'remove': 'Remove',
                    'error': 'Ooops, something wrong appended.'
                },
                error: {
                    'fileSize': 'The file size is too big (1M max).'
                }
            });
        </script>

    </body>
</html>